<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">


<head>
<title>Link Line</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<link href="css/style.css" rel="stylesheet" type="text/css" />
<!--link href="css/jqbanner.css" rel="stylesheet" type="text/css" media="screen" /-->
<link href="css/eggplant/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />
<link href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<link href="css/fullcalendar.css" rel="stylesheet" type="text/css" />
<link href="css/fullcalendar.print.css" rel="stylesheet" type="text/css" media='print' />

<!-- 樣版原有js -->
<!--script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/arial.js"></script>
<script type="text/javascript" src="js/cuf_run.js"></script-->
<!-- 樣版原有js -->

<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<!--script type="text/javascript" src="js/jquery-1.3.2.min.js"></script-->
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>


<!-- banner廣告 -->
<!--script type="text/javascript" src="js/jqbanner.js"></script-->

<!-- 驗證表單 -->
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/jquery.blockUI.js"></script>

<script type="text/javascript" src="js/jquery.history.js"></script>

<script type="text/javascript" src="js/jquery.autocomplete.js"></script>
<script type="text/javascript" src="js/fullcalendar.min.js"></script>



<script type="text/javascript">

$(function(){
//locationSwitcher("html/tab.html", "tab");

/* 初始化history */
jQuery.history.init(pageload);

/* 滑動List */
$("#accordion").accordion({ header: "h3" });

/* Datepicker(日曆) */
$('#datepicker').datepicker({
	inline: true
});

/* tabs */
$("#tab").click(function(){
	jQuery.history.load("html/tab"); // 寫入歷史訊息
	locationSwitcher("html/tab.html", "Test table");
});

/* Banner */
$("#banner").click(function(){
	locationSwitcher("html/banner.html", "banner");
});

/* 彈出視窗 */
$("#dialogtest").click(function(){
	$( "#dialog" ).dialog();
	return false;
});

$("#testtable").click(function(){
	$("#load").load("html/table.html", "testtable");
});

$("#DraggablePage").click(function(){
	$("#load").load("html/dragpage.html", "drag");
});

//換頁
function locationSwitcher(targetLocation, title){
    $("#load").load(targetLocation); 
    //$("#title").text(title);  
}

});


// 「上一頁」觸發後執行的函數
function pageload(hash) {
    // 根據傳回的 hash（錨點），AJAX 置換顯示的內容
    if(hash) {
        // 重新讀取指定頁面
        $("#load").load(hash + ".html");
    } else {
        // 如果沒有回傳值，代表已經回到 AJAX 的初始狀態頁，清空顯示的內容
        $("#load").empty();
    }
}

</script>

</head>

<body>
<div class="main">
	<div id="lang">
		<a>English</a>|
		<a>繁體中文</a>|
		<a>简体中文</a>
	</div>
  <div class="header">
    <div class="header_resize">
      <div class="logo">
        <h1><a href="#">Link <span>Line</span></a><small>Simple web template</small></h1>
      </div>
      <div class="clr"></div>
      
      <div class="menu_nav">
      <!--
        <ul>
          <li class="active"><a href="index.html">Home</a></li>
          <li><a href="support.html">Support</a></li>
          <li><a href="about.html">About Us</a></li>
          <li><a href="blog.html">Blog</a></li>
          <li><a href="contact.html">Contact Us</a></li>
        </ul>
        -->
      </div>
      
    </div>
  </div>
  <div class="clr"></div>
  <div class="content">
    <div class="content_resize">
   
   
      <div class="mainbar">   
        <div class="article">
          <div id="photo">
          </div>
          <div id="load">
          <!-- page -->	
          </div>
          <div class="clr"></div>
        </div>
      </div>
      
      <!-- sidebar -->
      <div class="sidebar">
      
		<!-- Menu -->
        <div class="gadget">
          <h2>Sidebar Menu</h2>
          <div class="clr"></div>
          <ul class="sb_menu">
            <li><a href="javascript:;" >Home</a></li>
            <li><a id="tab" href="javascript:;" rel="history">Test tabs</a></li>
            <li><a id="dialogtest" href="javascript:;" rel="history">Test Dialog</a></li>
            <!--li><a id="banner" href="javascript:;">Banner</a></li-->
            <li id="testtable"><a href="javascript:;">Test Table</a></li>
            <li id="DraggablePage"><a href="javascript:;">Draggable</a></li>
          </ul>
        </div> 
        
        <!-- 滑動List -->
		<div class="gadget">
			<div id="accordion">
				<div>
					<h3><a href="#">First</a></h3>
					<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
				</div>
				<div>
					<h3><a href="#">Second</a></h3>
					<div>Phasellus mattis tincidunt nibh.</div>
				</div>
				<div>
					<h3><a href="#">Third</a></h3>
					<div>Nam dui erat, auctor a, dignissim quis.</div>
				</div>
			</div>
		</div> 
		
		<!-- 日曆 -->
		<div class="gadget">
			<div id="datepicker"></div>
		</div>
			
      </div>      
      <div class="clr"></div>
    </div>
  </div>
  
  <div id="dialog" title="Basic dialog" style="display: none;">
	<p>This is the default dialog which is useful for displaying information.</p>
  </div>
  

  <!--div class="fbg">
    <div class="footer">
      <p class="lf">&copy; Copyright <a href="#">MyWebSite</a>.</p>
      <p class="rf">Layout by Rocket <a href="http://www.rocketwebsitetemplates.com/">Website Templates</a></p>
      <div class="clr"></div>
    </div>
  </div-->

  
</div>
</body>
</html>
